<template>
	<ele-submenu>
		<div slot="title">{{parent.title}}</div>
		<template v-for="(item,i) in parent.children">
			<!--menu_item_${index}_${i} 避免与上一级的 key 重复-->
			<ele-menu-item v-if="!item.children" :key="`menu_item_${index}_${i}`">{{item.title}}</ele-menu-item>
			<re-submenu v-else :key="`menu_item_${index}_${i}`" :parent="item"></re-submenu>
		</template>
	</ele-submenu>
</template>

<script>
	import menuComponents from '_c/menu';

	const {eleMenuItem, eleSubmenu} = menuComponents;

	export default {
		name: "ReSubmenu",
		components: {eleMenuItem, eleSubmenu},
		props: {
			parent: {
				type: Object,
				default: () => ({})
			},
			index: Number
		}
	}
</script>

<style scoped>

</style>
